$(function () {
    initNav();
})
window.onload = function () {
    regionlistshow()
    selectlistshow()
    hotwordlistshow()
    navTopShow()
    n_p_navshow()
    contentTab_1()
    contentTab_2()
    tabAutoPlay()
    listAutoPlay()
    showFirmWeek()
    firmweekAutoPlay()
    miaoshaShow(countDown())
    tabboxShow(0)
    tabboxmShow(0)
    bookTopShow(1)
}
//hdtools事件
$(".ddnewhead_area").on("mouseover", function () {
    show_area_list()
})
$(".ddnewhead_area").on("mouseout", function () {
    hidden_area_list()
})
function show_area_list() {
    $(".ddnewhead_area_a").css("display", "block"),
        $(".ddnewhead_area_list").css("display", "block")
}
function hidden_area_list() {
    $(".ddnewhead_area_list").css("display", "none")
}
function change_area(num, name) {
    $("#curent_area").html(name)
    return num
}
function regionlistshow() {
    $.ajax({
        url: "../static/data/regionlist.json"
    })
        .done(function (data) {
            $("#area_list").html(data.list.map(
                item => `<li><a href="javascript:void(0);" onclick="change_area('${item.num}','${item.name}')" num = "${item.num}">${item.name}</a></li>`
            ))
        })
}
function selectlistshow() {
    $.ajax({
        url: "../static/data/searchlist.json"
    })
        .done(function (data) {
            $("#search_all_category").html(data.list.map(
                item => `<a href="javascript:void(0);" onclick="selectCategory('${item.num}',this);">
                <span dd_name="${item.name}">${item.name}</span>
            </a>`
            ))
        })
}
function allCategoryShow() {
    $(".select_pop").css("height", "286")
}
function allCategoryHide() {
    $(".select_pop").css("height", "0")
}
function showgaoji(fele, sele) {
    $('#' + fele).addClass("hover")
    $('#' + sele).css("display", "block")
}
function hideotherchannel(fele, sele) {
    $('#' + fele).removeClass("hover")
    $('#' + sele).css("display", "none")
}
function selectCategory(num, content) {
    console.log($(content));
    $("#Show_Category_Name").html($("content").childen().html()).css("dd_name", $("content").childen().dd_name())
    return num
}

//热词搜索
function hotwordlistshow() {
    $.ajax({
        url: "../static/data/hotwordlist.json"
    })
        .done(function (data) {
            $(".search_hot").html(data.list.map(
                item => `<a href=${item.weblink} name="hotword" target="_blank">${item.wordname}</a>`
            ))
        })
        .done(function () {
            $(".search_hot").html("热搜：" + $(".search_hot").html())
        })
}
//顶部一级菜单栏
function navTopShow() {
    $.ajax({
        url: "../static/data/navtoplist.json"
    })
        .done(function (data) {
            $("#hd > div.nav_top > ul").append(data.list.map(
                item => $(`<li><a href=${item.weblink} name="nav1" target="_blank">${item.wordname}</a></li>`)
            ))
        })
}
//左侧导航栏
function n_p_navshow() {
    $.ajax({
        url: "../static/data/n_plist.json"
    })
        .done(function (data) {
            $(".new_pub_nav").html(data.list.map(function (item) {

                let $name1 = item.name1
                let $name2 = item.name2
                let $name3 = item.name3
                let $name1id = ""
                let $name1href = ""
                let $name2id = ""
                let $name2href = ""
                let $name3id = ""
                let $name3href = ""

                if (typeof $name1 === "object") {
                    $name1id = $name1.id
                    $name1href = $name1.href
                    $name1 = $name1.name

                }
                if (!$name2) {
                    $name2 = ""
                } else if (typeof $name2 === "object") {
                    $name2id = $name2.id
                    $name2href = $name2.href
                    $name2 = $name2.name
                }
                if (!$name3) {
                    $name3 = ""
                } else if (typeof $name3 === "object") {
                    $name3id = $name3.id
                    $name3href = $name3.href
                    $name3 = $name3.name
                }
                let content = `<li class="n_b" dd_name="${$name1}${$name2}" id="li_label_${item.number}"
                data-submenu-id="__ddnav_sort${item.number}" data_index=${item.number} data_key=${item.key}
                data_type="${item.type}">
                <span class="nav" id="categoryh_${item.number}">
                <a name="newcate${item.number}" dd_name="${$name1}" id=${$name1id} href=${$name1href} target="_blank">${$name1}</a>`

                if ($name2 !== "") {
                    content += `、<a name="newcate${item.number}" dd_name="${$name2}" id=${$name2id} href=${$name2href} target="_blank">${$name2}</a>`
                }
                if ($name3 !== "") {
                    content += `、<a name="newcate${item.number}" dd_name="${$name3}" id=${$name3id} href=${$name3href} target="_blank">${$name3}</a>`
                }
                content += `</span><span class="sign"></span></li>`
                return content
            }))
        })
}
//轮播图

let index = 0
let prev = 0

// 定时器
var t = 0
function autoPlay() {
    stop()
    var btn_r = document.querySelector(".focus_box>.btn_r")
    t = setInterval(function () {
        btn_r.dispatchEvent(new Event("click"));
    }, 2000);
    bindEvent()
}
function stop() {
    clearInterval(t);
}
autoPlay()
function bindEvent() {
    $(".pic li").removeClass("active").addClass("unactive")
    $(".pic li").eq(index).addClass("active").removeClass("unactive")
    $(".tab li").removeClass("on")
    $(".tab li").eq(index).addClass("on")
    $("#tehui ul").toggleClass("active").toggleClass("unactive")
    $(".active")
        .stop()
        .animate({
            opacity: 1
        }, 1000)
    $(".unactive")
        .stop()
        .animate({
            opacity: 0
        }, 1000)
}
function addIndex() {
    prev = index
    if (index === $(".tab li").length - 1) {
        index = 0
    } else {
        index++
    }
    bindEvent()
}
function reduceIndex() {
    prev = index
    if (index === 0) {
        index = $(".tab li").length - 1
    } else {
        index--
    }
    autoPlay()
}
$(function () {
    $(".focus_box").mouseover(function () {
        stop()
        $(".focus_box>.btn_l")
            .stop(true)
            .animate({
                left: 0
            })
        $(".focus_box>.btn_r")
            .stop(true)
            .animate({
                right: 0
            })
    })
    $(".focus_box").mouseout(function () {
        autoPlay()
        $(".focus_box>.btn_l")
            .stop(true)
            .animate({
                left: -46
            })
        $(".focus_box>.btn_r")
            .stop(true)
            .animate({
                right: -46
            })
    })
    $(".tehui_box").mouseover(function () {
        stop()
        $(".tehui_box>.btn_l")
            .stop(true)
            .animate({
                left: 0
            })
        $(".tehui_box>.btn_r")
            .stop(true)
            .animate({
                right: 0
            })
    })
    $(".tehui_box").mouseout(function () {
        autoPlay()
        $(".tehui_box>.btn_l")
            .stop(true)
            .animate({
                left: -46
            })
        $(".tehui_box>.btn_r")
            .stop(true)
            .animate({
                right: -46
            })
    })
    $(".btn_l").click(function () {
        reduceIndex()
    })
    $(".btn_r").click(function () {
        addIndex()
    })
    $(".tab li").mouseover(function () {
        $(".tab li").removeClass("on")
        $(this).addClass("on")
        index = $(this).html() - 1
        bindEvent()
    })
})
//右侧信息栏
function contentTab_1() {
    $.ajax({
        url: "../static/data/contentlist.json"
    })
        .done(function (data) {
            $("#cxgg_content").html(data.tab_1.map(
                item => $(`<li>
                <a href=${item.href} target="_blank"
                    title=${item.title} dd_name=${item.name}>
                    <span> ͯ${item.title}</span>
                </a>
            </li>`)
            ))
        })
}
function contentTab_2() {
    $.ajax({
        url: "../static/data/contentlist.json"
    })
        .done(function (data) {
            $(".fwgg_content").html(data.tab_2.map(
                item => $(`<li>
                <a href=${item.href} target="_blank"
                    title=${item.title} dd_name=${item.name}>
                    <span> ͯ${item.title}</span>
                </a>
            </li>`)
            ))
        })
}
function contentTab_Event() {
    $(".home_notice_gg .tabh_0").on("mouseover", function () {
        $(".home_notice_gg .tabh_0").addClass("on")
        $(".home_notice_gg .tabh_1").removeClass("on")
        change_tab()
        stoptab()
    })
    $(".home_notice_gg .tabh_1").on("mouseover", function () {
        $(".home_notice_gg tabh_1").addClass("on")
        $(".home_notice_gg tabh_0").removeClass("on")
        change_tab()
        stoptab()
    })
    $(".home_notice_gg").on("mouseout", function () {
        tabAutoPlay()
    })
}
contentTab_Event()
change_tab()
function change_tab() {
    if ($(".home_notice_gg .tabh_0").hasClass("on")) {
        $(".home_notice_gg .tab_1").css("display", "block")
        $(".home_notice_gg .tab_2").css("display", "none")
    } else {
        $(".home_notice_gg .tab_1").css("display", "none")
        $(".home_notice_gg .tab_2").css("display", "block")
    }
}
var tab_t = 0
function tabAutoPlay() {
    stoptab()
    tab_t = setInterval(function () {
        $(".home_notice_gg .tab_aa li").toggleClass("on")
        change_tab()
    }, 2000);

}
function stoptab() {
    clearInterval(tab_t);
}
// 轮播图
var list_t = 0
var index_l = 0
function addIndex_list() {
    if (index_l === $(".over .list_aa li").length - 1) {
        index_l = 1
        $(".list_aa").css("left", "-202" * (index_l - 1))
    } else {
        index_l++
    }
    changemixli(index_l)
}
function reduceIndex_list() {
    if (index_l === 0) {
        index_l = $(".over .list_aa li").length - 2
        $(".list_aa").css("left", "-202" * (index_l + 1))
    } else {
        index_l--
    }
    changemixli(index_l)
}
function changelist(index_l) {
    $(".over .list_aa")
        .animate({
            left: -202 * index_l
        })
}
function changemixli(index_l) {
    $(`.mix_marquee_tab li`).removeClass("current")
    $(`.mix_marquee_tab li:eq(${index_l - 1})`).addClass("current")
}
$(".btn_brand_prev").on("click", function () {
    reduceIndex_list()
    changelist(index_l)
})
$(".btn_brand_next").on("click", function () {
    addIndex_list()
    changelist(index_l)
})
$(`.mix_marquee_tab li`).on("mouseover", function (index_l) {
    index_l = $(this).html()
    changemixli(index_l)
    changelist(index_l)
})
$(".roll_aa").on("mouseover", function () {
    stoplist()
})
$(".roll_aa").on("mouseout", function () {
    listAutoPlay()
})
function listAutoPlay() {
    stoplist()
    var bb_next = document.querySelector(".btn_brand_next")
    list_t = setInterval(function () {
        bb_next.dispatchEvent(new Event("click"))
    }, 2000);
}
function stoplist() {
    clearInterval(list_t);
}
//今日秒杀抢购区
function miaoshaShow(index) {
    $.ajax({
        url: `../static/data/miaoshalist${index}.json`
    })
        .done(function (data) {
            $(".home_miaosha > .list").html(data.list.map(
                item => $(`<div class="info" pid="28495391" ddt-pit="0" dd_name="1">
                <a href="http://miao.dangdang.com?num=0" class="pic" target="_blank"
                title=${item.title}>
                <img src=${item.src} alt=${item.title}>
                </a>
                <div class="line">
                <span style="width:${item.num}" class="miao_progress_bar">
                </span>
                <span class="num_bg"></span>
                </div>
                <div class="num">已抢购${item.num}</div>
                <div class="name">
                <a href="http://miao.dangdang.com?num=0" target="_blank" title=${item.title}>${item.title}</a></div>
                <div class="price">¥<span>${item.price}</span><span class="del">${item.rprice}</span></div>
                </div>`)
            ))
        })
}
function countDown() {
    var target = new Date()
    var index = 0
    var target_h = target.getHours()
    var target_num = target.getTime()
    var now_Time = new Date()
    now_Time = now_Time.getTime()
    var count = target_num - now_Time

    if (count <= 0) {
        if (target_h > 0 && target_h < 8) {
            index = 0
            target.setHours(8, 00, 00)

        } else if (target_h >= 8 && target_h < 12) {
            index = 1
            target.setHours(12, 00, 00)

        } else if (target_h >= 12 && target_h < 16) {
            index = 2
            target.setHours(16, 00, 00)

        } else if (target_h >= 16 && target_h < 20) {
            index = 3
            target.setHours(20, 00, 00)

        } else if (target_h >= 20 && target_h < 24) {
            target.setHours(23, 59, 59, 999)
            index = 4
        }
        target_num = target.getTime()
        count = target_num - now_Time
    }
    var d_seconds = parseInt(count / 1000) % 60
    var d_minute = parseInt(count / 1000 / 60) % 60
    var d_hour = parseInt(count / 1000 / 60 / 60) % 24
    function judge_t(num) {
        if (num < 10) {
            num = "0" + num
        } else {
            num = num
        }
        return num
    }
    d_seconds = judge_t(d_seconds)
    d_minute = judge_t(d_minute)
    d_hour = judge_t(d_hour)
    $(".time .h").html(d_hour)
    $(".time .m").html(d_minute)
    $(".time .s").html(d_seconds)
    $(`.chang li>a`).removeClass("now")
    $(`.chang li:eq(${index})>a`).addClass("now")
    return index
}
var d_time = setInterval(function () {
    var index = countDown()
    miaoshaShow(index)
}, 1000)
function stopdtime() {
    clearInterval(d_time);
}
//厂商周
function showFirmWeek() {
    $.ajax({
        url: `../static/data/firmweeklist.json`
    })
        .done(function (data) {
            $(".home_taday_flash_box .clearfix").html(data.list1.map(
                item => $(`<li class="list1 on"><a>
                <img src=${item.src} class="pic">
                </a></li>`
                )
            ))
        })
        .done(function (data) {
            $(".home_taday_flash_box .clearfix").append(data.list2.map(
                item => $(`<li class="list2"><a>
                <img src=${item.src} class="pic">
                </a></li>`
                )
            ))
        })
}
$(".firm_week li").on("mouseover", function () {
    $(this).addClass("on").siblings().removeClass("on")
    if ($(this).hasClass("first")) {
        $(".clearfix .list1").addClass("on")
        $(".clearfix .list2").removeClass("on")
    } else {
        $(".clearfix .list2").addClass("on")
        $(".clearfix .list1").removeClass("on")
    }
})
$(".firm_week").on("mouseover", function () {
    stopfwlist()
})
$(".firm_week").on("mouseout", function () {
    firmweekAutoPlay()
})
var fw_t = 0
function firmweekAutoPlay() {
    stopfwlist()
    fw_t = setInterval(function () {
        $(".firm_week .head li").toggleClass("on")
        // $(".clearfix .list2").toggleClass("on")

        if ($(".firm_week .head .on").hasClass("first")) {
            $(".clearfix .list1").addClass("on")
            $(".clearfix .list2").removeClass("on")
        } else {
            $(".clearfix .list2").addClass("on")
            $(".clearfix .list1").removeClass("on")
        }
    }, 2000);
}
function stopfwlist() {
    clearInterval(fw_t);
}
// 图书、电子书等
$(".book_new .tab_box_aa .tab_aa li").on("mouseover", function () {
    var tabli = $(".book_new .tab_box_aa .tab_aa li")
    tabli.removeClass("on")
    $(this).addClass("on")
    var tabaa_index = 0
    for (var i = 0; i < $(".book_new .tab_box_aa .tab_aa li").length; i++) {
        if (tabli[i] === this) {
            tabaa_index = i
        }
    }
    tabboxShow(tabaa_index)
    tabboxmShow(tabaa_index)
})
var tabaa_t = 0
function tabboxShow(num) {
    $.ajax({
        url: `../static/data/tabboxlist${num}.json`
    })
        .done(function (data) {
            $(".tab_content_aa >.tab_2>.book_left_pic").html(data.part1.map(
                item => $(`<img src=${item.src}>`)
            ))
        })
        .done(function (data) {
            $(".tab_content_aa >.tab_2>.book_tab_img").html(data.part2.map(
                item => $(`<li class="line on">
                <a href=${item.src}>${item.content}</a>
            </li>`)
            ))
        })
        .done(function (data) {
            $(".tab_content_aa >.tab_2>.roll_aa").html(data.part3.map(
                item => $(`<ul class="mix_marquee_tab">
                <li class="">${item.pit}</li>
                </ul>
                <div class="over">
                    <ul class="">
                        <li class="_li_${item.pit}">
                            <a class="pic">
                                <img src=${item.src}>
                            </a>
                        </li>
                    </ul>
                </div>`)
            ))
        })
        .done(function (data) {
            $(".tab_content_aa >.tab_2>.book_upper2").html(data.part4.map(
                item => $(`<ul class="list_aa " id="component_3208542__9370_9358_9348_9346__9346">
                <li class="line1">
                <a class="img" href="">
                <img src=${item.src1}>
                </a>
                    <div class="icon_pop"></div>
                    <p class="name">
                    <a>${item.content1}</a>
                    </p>
                    <p class="price">
                    <span class="rob">
                        <span class="sign">¥</span>
                        <span class="num">${item.int1}</span>
                        <span class="tail">${item.float1}</span>
                    </span>
                    <span class="price_r">
                        <span class="sign">¥</span>
                        <span class="num">${item.rint1}</span>
                        <span class="tail">${item.rfloat1}</span>
                    </span>
                    </p>
                </li>
            </ul>
            <ul class="list_aa " id="component_3208542__9370_9358_9348_9346__9346">
                <li class="line1">
                <a class="img" href="">
                <img src=${item.src2}>
                </a>
                    <div class="icon_pop"></div>
                    <p class="name">
                    <a>${item.content2}</a>
                    </p>
                    <p class="price">
                    <span class="rob">
                        <span class="sign">¥</span>
                        <span class="num">${item.int2}</span>
                        <span class="tail">${item.float2}</span>
                    </span>
                    <span class="price_r">
                        <span class="sign">¥</span>
                        <span class="num">${item.rint2}</span>
                        <span class="tail">${item.rfloat2}</span>
                    </span>
                    </p>
                </li>
            </ul>
            `)
            ))
        })
}

function tabboxmShow(num) {
    $.ajax({
        url: `../static/data/tabboxmlist${num}.json`
    })
        .done(function (data) {
            $(".tab_content_aa >.tab_2>.book_lower4").html(data.list.map(
                item => $(`<ul class="list_aa " id="component_3208542__9370_9358_9353_9349__9349">
                <li class="line1">
                    <a class="img" href=" " >
                        <img src=${item.src}></a>
                    <div class="icon_pop"></div>
                    <p class="name">
                        <a href=" ">${item.content}</a>
                    </p>
                    <p class="price">
                        <span class="rob">
                            <span class="sign">¥</span>
                            <span class="num">${item.int}</span>
                            <span class="tail">${item.float}</span>
                        </span>
                        <span class="price_r">
                            <span class="sign">¥</span>
                            <span class="num">${item.rint}</span>
                            <span class="tail">${item.rfloat}</span>
                        </span>
                    </p>
                </li>
            </ul>`)
            ))
        })
}
//图书畅销榜
function bookTopShow(num) {
    $.ajax({
        url: `../static/data/booktoplist${num}.json`
    })
        .done(function (data) {
            $(".tab_content_aa .book_top > .list_ab").html(data.list1.map(
                item => $(`
                <li class="line${item.num} ${item.class1}">
                <span class="num num${item.num}">${item.num}</span>
                <a class="img" href="./dddetail.html">
                    <img src=${item.src}>
                </a>
                <p class="name">
                    <a href=" ">${item.content}
                        <span>${item.span}</span>
                    </a>
                </p>
            </li>
            <li class="line${item.num} ${item.class2}">
            <span class="num num${item.num}">${item.num}</span>
            <p class="name">
                <a href=" ">${item.content}<span></span></a>
            </p>
            </li>
                `)
            ))
        })
}
$(".tab_content_aa .book_top >.list_ab").on("mouseover", ".bar", function () {
    $(".item").addClass("hidden")
    $(".bar").removeClass("hidden")
    $(this).addClass("hidden")
    $(this).prev().removeClass("hidden")
})

$(".floor_tab_bang .head li").on("mouseover", function () {
    $(".floor_tab_bang .head li").removeClass("on")
    $(this).addClass("on")
    if ($(this).hasClass("first")) {
        bookTopShow(1)
    } else {
        bookTopShow(2)
    }
})
//推荐-懒加载

function tuijianShow() {
    let data = $.ajax({
        url: "../static/data/tuijianlist.json",
        type: "GET",
        dataType: "json"
    })
        .done(function (data) {
            renderPage(data);
            $(".lazy").lazyload()
        })
}
tuijianShow()

function renderPage(data) {
    $("#indexreco").html(data.list.map(
        item => $(`
        <li ddt-pit="${item.pit}" class="">
        <a href=" " class="pic">
            <img class="lazy" data-original="${item.src}">
        </a>
        <p class="name">
            <a href=" " target="_blank"
                title=${item.title}>${item.title}
            </a>
        </p>
        <p class="price">
        <span class="price_r">¥
            <span>${item.price}</span>
        </span>
        <span class="ebookprice_n">${item.ebook}    <span class="sign"></span>
            <span class="num">${item.eprice}
        </span>
        </span>
        </p>
    </li>
        `)
    ))
}
// 楼梯
$(function () {
    let animate = false;
    function con_changeClass() {
        // $(this).addClass("on")
        $(".fix_box").addClass("on")
        $(this)
            .addClass("on")
            .siblings()
            .removeClass("on")
    }
    $(".con .fix_screen_list").on("mouseover", "li", con_changeClass)
    $(".con .fix_screen_list").on("mouseout", "li", function () {
        $(this).removeClass("on")
        $(".fix_box").removeClass("on")
    })
    let top_list = []
    $(".ddcontent").each(function () {
        top_list.push($(this).offset().top)
    });
    $(".con .fix_screen_list").on("click", "li", function () {
        con_changeClass.call(this)
        var ddindex = $(this).index()
        changeScrollTop(ddindex)
        animate = true;
    })
    function changeScrollTop(ddindex) {
        $("html,body")
            .stop(true)
            .animate({
                scrollTop: top_list[ddindex]
            },
                function () {
                    animate = false;
                })
    }
    function getIndex() {
        var scrollTop = $("html,body").scrollTop();
        if (scrollTop >= top_list[top_list.length - 1]) {
            return top_list.length - 1;
        }
        for (let i = 0; i < top_list.length; i++) {
            if (scrollTop >= top_list[i] && scrollTop < top_list[i + 1]) {
                return i;
            }
        }
    }
    function changeBtnClass(index) {
        $(".con .fix_screen_list li")
            .removeClass("on")
            .eq(index)
            .addClass("on")
    }
    $(window).scroll(function () {
        if (!animate) {
            var index = getIndex();
            changeBtnClass(index);
        }
    });
    $(".gobackbox").on("click", function () {
        $("html,body")
            .stop(true)
            .animate({

                scrollTop: 0
            })
    })
})

window.onscroll = function () {
    var scrollTop = document.body.scrollTop || document.documentElement.scrollTop;
    if (scrollTop > $(".home_taday_flash_box").offset().top) {
        $(".mix_search_top").css("display", "block")
        $(".gobackbox").css("display", "block")
        $(".con .fix_screen_list").css("display", "block")
    } else {
        $(".mix_search_top").css("display", "none")
        $(".gobackbox").css("display", "none")
        $(".con .fix_screen_list").css("display", "none")
    }
}